<ion-view left-buttons="leftButtons"
          class="view-notification">
  <ion-nav-title>
    {{'COMMON.NOTIFICATIONS.TITLE' | translate}}
  </ion-nav-title>

  <ion-nav-buttons side="secondary">
      <button class="button button-icon button-clear icon ion-android-more-vertical visible-xs visible-sm"
              ng-click="showActionsPopover($event)">
      </button>
  </ion-nav-buttons>

  <ion-content class="padding no-padding-xs" scroll="true">
    <ion-refresher pulling-text="{{'COMMON.BTN_REFRESH' | translate}}"
                   on-refresh="refresh(true)">
    </ion-refresher>

    <!-- Buttons bar-->
    <div class="hidden-xs hidden-sm padding text-center" >

      <button class="button button-stable button-small-padding icon ion-loop ink"
              ng-click="refresh()">
      </button>

      <button class="button button-raised icon-left ion-checkmark ink"
              ng-click="markAllAsRead()">
        {{'COMMON.NOTIFICATIONS.MARK_ALL_AS_READ' | translate}}
      </button>
    </div>

    <div class="row no-padding">
      <div class="col col-20 hidden-xs hidden-sm">&nbsp;</div>

      <div class="col no-padding-xs">

        <div class="center padding" ng-if="search.loading">
          <ion-spinner icon="android"></ion-spinner>
        </div>

        <div class="padding gray" ng-if="!search.loading && !search.results.length" translate>
          COMMON.NOTIFICATIONS.NO_RESULT
        </div>

        <ng-include src="'plugins/es/templates/notification/list_notification.html'"></ng-include>


      </div>

      <div class="col col-20 hidden-xs hidden-sm">&nbsp;</div>

    </div>

  </ion-content>

</ion-view>
